import 'dart:ui';

import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:net_store/DataSource/DataStore.dart';
import 'package:net_store/Entities/HotStore.dart';
import 'package:net_store/Entities/Product.dart';
import 'package:net_store/Pages/ProductDetailsPage.dart';
import 'package:net_store/Pages/ProductViewPage.dart';
import 'package:net_store/Widgets/SearchButton.dart';
import 'package:net_store/main.dart';

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _HomePageState();

}

class _HomePageState extends State<HomePage> {

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: <Widget>[
        SliverToBoxAdapter(
          child: AppBar(
            backgroundColor: Colors.deepPurple,
            title: SearchButton(
              onTap: () {
                print("Tapped!");
              },
            ),
            centerTitle: true,
          )
        ),
        SliverAppBar(
          backgroundColor: Colors.transparent,
          centerTitle: true,
          expandedHeight: 320.0,
          flexibleSpace: FlexibleSpaceBar(
            background: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                SizedBox(height: 20.0,),
                DataStore.recommandations.length > 0 ? CarouselSlider(
                  items: DataStore.recommandations.map((recommandation) => DataStore.products.firstWhere((product) => product.guid == recommandation.product && product.images.length > 0)).map((product) => buildRecommandedList(product)).toList(),
                  height: 180.0,
                  autoPlay: true,
                  interval: Duration(seconds: 3),
                ) : SizedBox(),
                Padding(
                  padding: EdgeInsets.only(top: 5, bottom: 5, left: 10, right: 10),
                  child: Text("ئاۋات بازارلار", style: TextStyle(color: Colors.deepOrange)),
                ),
                SizedBox(
                    height: 90.0,
                    child: Card(
                      child: ListView(
                          scrollDirection: Axis.horizontal,
                          children: DataStore.hotStories.map((store) => buildHotStoreItem(store)).toList()
                      ),
                    )
                ),

              ],
            )
          ),
        ),
        SliverToBoxAdapter(child: Padding(
          padding: EdgeInsets.only(top: 5, bottom: 5, left: 10, right: 10),
          child: Text("تەۋسىيە تاۋارلار", style: TextStyle(color: Colors.deepOrange)),
        ),),
        SliverGrid(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              mainAxisSpacing: 10.0
          ),
          delegate: SliverChildListDelegate(DataStore.products.map((product) => buildProductItem(product)).toList()),
        ),
      ],
    );
  }

  Widget buildProductItem(Product product){
    return InkWell(
      child: Padding(
        padding: EdgeInsets.all(5.0),
        child: Card(
          child: Stack(
            children: <Widget>[
              Center(
                child: Hero(tag: product.guid, child: Image.network(product.images.first)),
              ),
              Align(
                  alignment: Alignment(0.0, 1.0),
                  child: Padding(
                    padding: EdgeInsets.all(8.0),
                    child: BackdropFilter(
                      filter: ImageFilter.blur(sigmaX: 8.0, sigmaY: 8.0),
                      child: Container(
//                      color: Color(0xa0ffffff),
                        child: Row(
                          children: <Widget>[
                            Expanded(
                              child: Text(product.name),
                            ),
                            Text(product.exportprice.toString(), style: TextStyle(
                                color: Colors.red
                            ),)
                          ],
                        ),
                      ),
                    ),
                  )
              ),
              Align(
                alignment: Alignment(1.0, -1.0),
                child: Container(
                  padding: EdgeInsets.all(3.0),
                  child: Icon(Icons.favorite_border, color: Colors.black45,),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.only(
                      bottomLeft: Radius.circular(15.0)
                    ),
                    boxShadow: [
                      BoxShadow(color: Colors.black12, offset: Offset(-2.0, 2.0), spreadRadius: 1.0, blurRadius: 1.0)
                    ]
                  ),
                )
              )
            ],
          ),
        ),
      ),
      onTap: (){
        Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProductDetailsPage(product)));
      },
    );
  }
  Widget buildRecommandedList(Product product){
    return InkWell(
      child: SizedBox(
        width: 300.0,
        child: Card(
          child: Image.network(product.images.first),
        ),
      ),
      onTap: (){
        Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProductDetailsPage(product)));
      },
    );
  }
  Widget buildHotStoreItem(HotStore store){
    return InkWell(
      child: SizedBox(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Image.network(store.icon, width: 30.0, height: 30.0,),
            Text(store.name, textAlign: TextAlign.center,)
          ],
        ),
        height: 80.0,
        width: 100.0,
      ),
      onTap: () async {
        var products = await dataSource.getProductsOfStore(store.guid);
        Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProductViewPage(products)));
      },
    );
  }
}
